<template>
    <div>
        <div class="top">
            <div @click="back">
                <van-icon name="arrow-left" />
            </div>

            <div>
                <slot name="tip"></slot>
            </div>
        </div>
    </div>
</template>

<script>
export default {
  data () {
    return {

    }
  },
  methods: {
    back () {
      this.$router.back()
    }
  }
}
</script>

<style scoped>
.top{
    width: 100%;
    height: 50px;
    background-color: white;
    position: relative;
}
.top > div:nth-child(1){
    width: 20%;
     line-height: 50px;
    position: absolute;
    z-index: 99;
}
.top > div:nth-child(2){
    width: 100%;
    line-height: 50px;
    position: absolute;
}
.top h1{
    text-align: center;
    font-size: 1.25rem;
    color: black;
}
.top i{
    line-height: 50px;
    font-size: 1.75rem;
    color: black;
}

</style>
